<!DOCTYPE html>
<html>
<head lang="en">
    <title>个人中心</title>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="stylesheet" href="../css/reset.css"/>
    <link rel="stylesheet" href="../css/common.css"/>
    <script src="../js/angular-1.4.6.min.js"></script>
    <script src="../js/jquery-1.8.3.min.js"></script>
    <style>
        .user-info{background-color: #fbe4ee;padding: 10px 0;}
        .user-info .info-left{}
        .user-info .info-left .face{width: 80px;height: 80px;border-radius: 80px;overflow: hidden;border:5px solid #fff;margin-left:  30px;}
        .user-info .info-left .face img{width: 100%;height: 100%;display: block;}
        .user-info .info-left .name{margin-left: 20px;}
        .user-info .info-left .name h3{font-weight: normal;color: #d94b87;margin-top: 20px;}
        .user-info .info-left .name p{font-size: 12px;color: #666;margin-top: 10px;}
        .user-info .info-right{}
        .user-info .info-right table{padding-top: 10px;}
        .user-info .info-right table th{font-weight: normal;text-align: center;font-size: 12px;border-left: 1px dashed #ccc;height: 70px;}
        .user-info .info-right table th span{color: #333;}
        .user-info .info-right table th p{font-size: 12px;margin-top: 15px;color: #666;}
        .user-info .info-right table .cash{width: 110px;}
        .user-info .info-right table .cash p{color: #d94b87;font-size: 14px;}
        .user-info .info-right table .red-bag{width: 220px;}
        .user-info .info-right table .red-bag p{color: #d94b87;font-size: 14px;}
        .user-info .info-right table .integral{width: 110px;}
        .user-info .info-right table .level{width: 200px;}

        .content{padding-bottom: 80px;}

        .left-nav{float: left;width: 230px;background-color: #efefef;height: 100%;}
        .left-nav .title{text-align: center;color: #d94b87;font-size: 16px;height: 50px;line-height: 50px;}
        .left-nav .title img{width: 20px;vertical-align: text-bottom;margin-right: 5px;}
        .left-nav dl{border-top: 1px solid #ddd;padding-left: 70px;padding-top: 15px;padding-bottom: 10px;}
        .left-nav dl dt{font-weight: bold;color: #333;font-size: 15px;padding-bottom: 10px;}
        .left-nav dl dt img{vertical-align: middle;width: 16px;margin-right: 5px;}
        .left-nav dl dd{font-size: 12px;padding: 7px 0 7px 21px;}
        .left-nav dl dd a{color: #666;}
        
        .right-con{width: 900px;}
        .right-con .r-c-nav{overflow: hidden;margin-left: -20px;padding-top: 30px;}
        .right-con .r-c-nav li{float: left;width: 210px;height: 60px;line-height: 60px;margin-left: 20px;text-align: center;font-size: 14px;}
        .right-con .r-c-nav li a{color: #ffffff;display: block;}
        .right-con .r-c-nav .l1{background-color: #b9d05b;}
        .right-con .r-c-nav .l2{background-color: #f68e75;}
        .right-con .r-c-nav .l3{background-color: #efa358;}
        .right-con .r-c-nav .l4{background-color: #6bda8e;}

        .r-c-table{margin-top: 30px;}
        .r-c-table-title a{color: #0062a6;margin-top: 10px;}
        .r-c-table table{border-collapse: collapse;font-size: 12px;width: 100%;margin-top: 10px;color: #333;}
        .r-c-table table th{height: 38px;font-weight: normal;background-color: #efefef;border: 1px solid #ddd;color: #666;border-top: 1px solid #d94b87;}
        .r-c-table table td{padding: 12px;border: 1px solid #ddd;text-align: center;}
        .r-c-table table .des{overflow: hidden;width: 300px;}
        .r-c-table table .des img{float: left;}
        .r-c-table table .des p{float: left;width: 210px;height: 60px;line-height: 20px;overflow: hidden;color: #666;font-size: 12px;
            text-align: left;word-break: break-all;margin-left: 10px;}
        .r-c-table table .buy-now{display: inline-block;width: 100px;height: 36px;line-height: 36px;text-align: center;
            background-color: #fb81b4;font-size: 14px;color: #fff;border-radius: 4px;}
        .r-c-table table .del{display: inline-block;width: 40px;height: 40px;text-align: center;line-height: 40px;color: #999;
            font-size: 20px;font-family: "宋体";font-weight: bold;}

        .r-c-help{margin-top: 20px;}
        .r-c-help .title{font-size: 18px;color: #333;padding-bottom: 10px;border-bottom: 1px solid #ef1569;}
        .r-c-help ul{overflow: hidden;margin-top: 15px;}
        .r-c-help ul li{width: 20%;float: left;line-height: 24px;}
        .r-c-help ul li a{color: #0062a6;font-size: 12px;}
        .r-c-help ul li a img{vertical-align: middle;margin-right: 4px;}

        .r-c-guess-like{margin-top: 50px;}
        .r-c-guess-like .title{font-size: 18px;color: #333;padding-bottom: 10px;border-bottom: 1px solid #ef1569;}
        .r-c-guess-like ul{margin-left: -20px;}
        .r-c-guess-like ul li{float: left;width: 210px;margin-left: 20px;padding: 15px 0;outline: 1px solid #ddd;margin-top: 20px;}
        .r-c-guess-like ul li a{display: block;width: 180px;margin: 0 auto;font-size: 12px;}
        .r-c-guess-like ul li a .img{display: block;width: 180px;height: 180px;}
        .r-c-guess-like ul li a .price{font-size: 14px;margin-top: 5px;color: #ef1569;}
        .r-c-guess-like ul li a .des{color: #333;font-size: 12px;margin-top: 2px;}
        .r-c-guess-like ul li a div{margin-top: 10px;}
        .r-c-guess-like ul li a div span{color: #999;}
        .r-c-guess-like ul li a div p{font-size: 12px;color: #666;}
        .r-c-guess-like ul li a div p img{vertical-align: text-top;}
    </style>
</head>
<body ng-app="">
<div ng-include="'../public/header.html'"></div>

<div class="container-full user-info">
    <div class="container overflow">
        <div class="fl info-left overflow">
            <div class="fl face">
                <img src="../img/QQ截图20160729150552.png" alt=""/>
            </div>
            <div class="fl name">
                <h3>下午好，leon</h3>
                <p>绑定手机：13743219865 &nbsp;&nbsp;&nbsp;&nbsp;邮箱：657346564@qq.com</p>
            </div>
        </div>
        <div class="fr info-right">
            <table border="0" cellpadding="0" cellspacing="0">
                <tr>
                    <th class="cash">
                        <span>余额</span>
                        <p>￥100.00</p>
                    </th>
                    <th class="red-bag">
                        <span>红包</span>
                        <p>共计5个，价值￥20.00</p>
                    </th>
                    <th class="integral">
                        <span>消费积分</span>
                        <p>345积分</p>
                    </th>
                    <th class="level">
                        <span>等级</span>
                        <p>铜牌（12/1000）</p>
                    </th>
                </tr>
            </table>
        </div>
    </div>
</div>
<div class="container content clear">
    <div class="left-nav">
        <p class="title">
            <a href="personal_info.html"><img src="../img/user(2).png" alt=""/>个人中心</a>
        </p>
        <dl>
            <dt><img src="../img/less2.png" alt=""/>订单中心</dt>
            <dd><a href="">我的订单</a></dd>
            <dd><a href="">收货地址</a></dd>
            <dd><a href="">缺货登记</a></dd>
            <dd><a href="">退换货订单</a></dd>
        </dl>
        <dl>
            <dt><img src="../img/less2.png" alt=""/>会员中心</dt>
            <dd><a href="">用户信息</a></dd>
            <dd><a href="">我的收藏</a></dd>
            <dd><a href="">我的留言</a></dd>
            <dd><a href="">我的推荐</a></dd>
            <dd><a href="">评论/晒单</a></dd>
            <dd><a href="">我的提货</a></dd>
        </dl>
        <dl>
            <dt><img src="../img/less2.png" alt=""/>账户中心</dt>
            <dd><a href="">我的红包</a></dd>
            <dd><a href="">跟踪包裹</a></dd>
            <dd><a href="">资金管理</a></dd>
        </dl>
    </div>
    <div class="right-con fr">
        <ul class="r-c-nav">
            <li class="l1"><a href="">待确认（1）</a></li>
            <li class="l2"><a href="">待付款（1）</a></li>
            <li class="l3"><a href="">待确认收货（1）</a></li>
            <li class="l4"><a href="">已完成（1）</a></li>
        </ul>
        <div class="r-c-table">
            <div class="r-c-table-title overflow">
                <span class="fl fs-18 color-333">近期订单</span>
                <a class="fr fs-12" href="">查看所有订单></a>
            </div>
            <table border="0" cellspacing="0" cellpadding="0">
                <tr>
                    <th>订单编号</th>
                    <th>状态</th>
                    <th>总金额</th>
                    <th>收货人</th>
                    <th>下单日期</th>
                    <th>操作</th>
                </tr>
                <tr>
                    <td style="color: #ef1569;">20160305344523421</td>
                    <td>未付款</td>
                    <td style="color: #ef1569;">￥2255.00</td>
                    <td>刘德华</td>
                    <td style="color: #666;">2016-05-07 15:12:34</td>
                    <td><a href="" style="color: #0062a6;">订单详情</a></td>
                </tr>
            </table>
        </div>
        <div class="r-c-table">
            <div class="r-c-table-title overflow">
                <span class="fl fs-18 color-333">近期收藏</span>
                <a class="fr fs-12" href="">查看所有收藏></a>
            </div>
            <table border="0" cellspacing="0" cellpadding="0">
                <tr>
                    <th>商品</th>
                    <th>单价</th>
                    <th>收藏时间</th>
                    <th>操作</th>
                    <th>删除</th>
                </tr>
                <tr>
                    <td class="des">
                        <a href="product_detail.html">
                            <img src="../img/QQ截图20160801162655.png" alt="" width="65" height="65"/>
                            <p>爱他美Aptamil 幼儿配方奶粉3段800g（原装进口 罐）12-36个月</p>
                        </a>
                    </td>
                    <td style="color: #666;">￥156.00</td>
                    <td style="color: #999;">2016-05-07 15:12:34</td>
                    <td><a class="buy-now" href="">立即购买></a></td>
                    <td><a class="del" href="javascript:void('删除');">&times;</a></td>
                </tr>
                <tr>
                    <td class="des">
                        <a href="product_detail.html">
                            <img src="../img/QQ截图20160801162655.png" alt="" width="65" height="65"/>
                            <p>爱他美Aptamil 幼儿配方奶粉3段800g（原装进口 罐）12-36个月</p>
                        </a>
                    </td>
                    <td style="color: #666;">￥156.00</td>
                    <td style="color: #999;">2016-05-07 15:12:34</td>
                    <td><a class="buy-now" href="">立即购买></a></td>
                    <td><a class="del" href="javascript:void('删除');">&times;</a></td>
                </tr>
                <tr>
                    <td class="des">
                        <a href="product_detail.html">
                            <img src="../img/QQ截图20160801162655.png" alt="" width="65" height="65"/>
                            <p>爱他美Aptamil 幼儿配方奶粉3段800g（原装进口 罐）12-36个月</p>
                        </a>
                    </td>
                    <td style="color: #666;">￥156.00</td>
                    <td style="color: #999;">2016-05-07 15:12:34</td>
                    <td><a class="buy-now" href="">立即购买></a></td>
                    <td><a class="del" href="javascript:void('删除');">&times;</a></td>
                </tr>
                <tr>
                    <td class="des">
                        <a href="product_detail.html">
                            <img src="../img/QQ截图20160801162655.png" alt="" width="65" height="65"/>
                            <p>爱他美Aptamil 幼儿配方奶粉3段800g（原装进口 罐）12-36个月</p>
                        </a>
                    </td>
                    <td style="color: #666;">￥156.00</td>
                    <td style="color: #999;">2016-05-07 15:12:34</td>
                    <td><a class="buy-now" href="">立即购买></a></td>
                    <td><a class="del" href="javascript:void('删除');">&times;</a></td>
                </tr>
                <tr>
                    <td class="des">
                        <a href="product_detail.html">
                            <img src="../img/QQ截图20160801162655.png" alt="" width="65" height="65"/>
                            <p>爱他美Aptamil 幼儿配方奶粉3段800g（原装进口 罐）12-36个月</p>
                        </a>
                    </td>
                    <td style="color: #666;">￥156.00</td>
                    <td style="color: #999;">2016-05-07 15:12:34</td>
                    <td><a class="buy-now" href="">立即购买></a></td>
                    <td><a class="del" href="javascript:void('删除');">&times;</a></td>
                </tr>
            </table>
        </div>
        <div class="r-c-help">
            <p class="title">帮助</p>
            <ul>
                <li><a href=""><img src="../img/QQ截图20160805152012.png" alt=""/>售后服务保障</a></li>
                <li><a href=""><img src="../img/QQ截图20160805152012.png" alt=""/>售后服务保障</a></li>
                <li><a href=""><img src="../img/QQ截图20160805152012.png" alt=""/>售后服务保障</a></li>
                <li><a href=""><img src="../img/QQ截图20160805152012.png" alt=""/>售后服务保障</a></li>
                <li><a href=""><img src="../img/QQ截图20160805152012.png" alt=""/>售后服务保障</a></li>
                <li><a href=""><img src="../img/QQ截图20160805152012.png" alt=""/>售后服务保障</a></li>
                <li><a href=""><img src="../img/QQ截图20160805152012.png" alt=""/>售后服务保障</a></li>
                <li><a href=""><img src="../img/QQ截图20160805152012.png" alt=""/>售后服务保障</a></li>
                <li><a href=""><img src="../img/QQ截图20160805152012.png" alt=""/>售后服务保障</a></li>
            </ul>
        </div>
        <div class="r-c-guess-like">
            <p class="title">猜你喜欢</p>
            <ul class="clear">
                <li>
                    <a href="">
                        <img class="img" src="../img/QQ截图20160801162655.png" alt=""/>
                        <p class="price fs-14">￥12.00</p>
                        <p class="des text-overflow">爱他美Aptamil 幼儿配方奶粉3段800g（原装进口 罐）12-36个月</p>
                        <div class="overflow">
                            <span class="fl">销售量：0</span>
                            <p class="fr">
                                <img src="../img/QQ截图20160805155032.png" alt=""/>100%
                            </p>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="">
                        <img class="img" src="../img/QQ截图20160801162655.png" alt=""/>
                        <p class="price fs-14">￥12.00</p>
                        <p class="des text-overflow">爱他美Aptamil 幼儿配方奶粉3段800g（原装进口 罐）12-36个月</p>
                        <div class="overflow">
                            <span class="fl">销售量：0</span>
                            <p class="fr">
                                <img src="../img/QQ截图20160805155032.png" alt=""/>100%
                            </p>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="">
                        <img class="img" src="../img/QQ截图20160801162655.png" alt=""/>
                        <p class="price fs-14">￥12.00</p>
                        <p class="des text-overflow">爱他美Aptamil 幼儿配方奶粉3段800g（原装进口 罐）12-36个月</p>
                        <div class="overflow">
                            <span class="fl">销售量：0</span>
                            <p class="fr">
                                <img src="../img/QQ截图20160805155032.png" alt=""/>100%
                            </p>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="">
                        <img class="img" src="../img/QQ截图20160801162655.png" alt=""/>
                        <p class="price fs-14">￥12.00</p>
                        <p class="des text-overflow">爱他美Aptamil 幼儿配方奶粉3段800g（原装进口 罐）12-36个月</p>
                        <div class="overflow">
                            <span class="fl">销售量：0</span>
                            <p class="fr">
                                <img src="../img/QQ截图20160805155032.png" alt=""/>100%
                            </p>
                        </div>
                    </a>
                </li>
            </ul>
        </div>
    </div>
</div>

<div ng-include="'../public/footer2.html'"></div>
</body>
<script src="../js/common.js"></script>
</html>